<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>首页</title>
    <script src="jq.js"></script>
    <script>
        let loginUser = null;

        function init(){
            const loginUserStr = sessionStorage.getItem("loginUser")
            //字符串转为对象
            loginUser = JSON.parse(loginUserStr);
            console.log(loginUser)
        }

        function logout(){
            if(confirm("确认要退出吗?")){
                $.post("http://localhost:8080/user/logout",{
                    userId:loginUser.userId
                },function (res){
                    if(res.code == 200){
                        sessionStorage.removeItem("loginUser")
                        init()
                        showUser()
                    }else{
                        alert(res.msg);
                    }
                })

            }
        }

        function showUser(){
            if(loginUser != null){
                $("#login").html(`<span>欢迎:${loginUser.nickname}</span> <button onclick="logout()">注销</button>`)
                $("#adminlink").show()
            }else{
                $("#login").html(`<a href="login.html">登录</a>`);
                $("#adminlink").hide()
            }
        }

        $(function (){
            init()
            showUser()
        })
    </script>
</head>
<body>
    <div id="login">
        <a href="login.html">登录</a>
        <span>欢迎:xxx</span>
    </div>
    <a href="admin.html" id="adminlink">管理员页</a>
    <h1>首页</h1>
    <h2>谁都可以看</h2>
</body>
</html>